<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Title</title>
    <link href="${request.contextPath}/static/ihomeStatic/css/bootstrap.min.css" rel="stylesheet">
    <link href="${request.contextPath}/static/ihomeStatic/js/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
    <link href="${request.contextPath}/static/ihomeStatic/css/font-awesome.min.css" rel="stylesheet">
    <link href="${request.contextPath}/static/ihomeStatic/css/animate.min.css" rel="stylesheet">
    <link href="${request.contextPath}/static/ihomeStatic/css/style.min.css" rel="stylesheet">
    <link href="${request.contextPath}/static/ihomeStatic/js/layer/mobile/need/layer.css" rel="stylesheet">


    <style></style>

</head>
<body class="fixed-sidebar full-height-layout">
<input type="hidden" id="hi1">
<input type="hidden" id="hi2">
<div class="wrapper wrapper-content">
    <div class="ibox">
        <div class="ibox-content">
            <div id="content" class="row">
                <div class="row">
                    <div class="col-sm-12">
                        <form id="searchForm" class="form-inline" action="javascript:void(0)">
                            <!-- 支持排序 -->
                            <div class="form-group">

                            科目: <select id="course" name="course" class="form-control" style="width: 300px" onchange="changeChapter()">
                                            <option value=""></option>
                                    <#if course??>
                                        <#list course as c>
                                            <option value=${c.id}>${c.courseName}</option>
                                        </#list>
                                    </#if>
                                </select>
                                章节: <select id="chapter" name="chapter" class="form-control" style="width: 300px">
                                            <option value=""></option>
                                    <#if chapter??>
                                        <#list chapter as ch>
                                            <option value=${ch.id}>${ch.chapterName}</option>
                                        </#list>
                                    </#if>
                                </select>
                                题型: <select id="questionsType" name="questionType" class="form-control" style="width: 300px">
                                                <option value=""></option>
                                    <#if types??>
                                        <#list types as t>
                                            <#if t.questionType =="1">
                                                <option value="1">基础选择题</option>
                                            </#if>
                                            <#if t.questionType =="2">
                                                <option value="2">扩展选择题</option>
                                            </#if>
                                            <#if t.questionType =="3">
                                                <option value="3">基础必会题</option>
                                            </#if>
                                            <#if t.questionType =="4">
                                                <option value="4">扩展进阶题</option>
                                            </#if>
                                        </#list>
                                    </#if>
                                </select>
                            有效/无效: <select id="status" name="status" class="form-control" style="width: 300px">
                                    <option value=""></option>
                                    <option value="Y">有效</option>
                                    <option value="N">无效</option>
                                </select>
                                <button type="button" class="btn btn-sm btn-primary" id="search-btn"><i
                                            class="fa fa-search"></i> 搜索
                                </button>
                                <button type="button" class="btn btn-sm btn-primary" id="clean-btn" onclick=""><i
                                            class="fa fa-search"></i> 清除
                                </button>
                                </span>
                            </div>
                        </form>
                        <br>
                    </div>
                </div>

                <div class="row">
                    <div class="col-sm-12">
                        <div class="">
                            <a href="javascript:;" class="btn btn-success btn-xs" onclick="insert()"><i class="fa fa-plus"></i>新增</a>
                            <a href="javascript:;" class="btn btn-info btn-xs" onclick=""><i class="fa fa-edit"></i>修改</a>
                            <a href="javascript:;" class="btn btn-danger btn-xs" onclick="deletes()"><i class="glyphicon glyphicon-remove"></i>删除</a>
                            <!-- 增加按钮 -->
                        </div>
                        <br>
                    </div>
                </div>
                <div class="row">
                    <div class="col-sm-12">
                        <div class="jqGrid_wrapper">
                            <table id="datatable"></table>
                            <div id="table_pager"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
<script src="${request.contextPath}/static/ihomeStatic/js/jquery-1.12.4.js"></script>
<script src="${request.contextPath}/static/ihomeStatic/js/bootstrap.min.js"></script>
<script src="${request.contextPath}/static/ihomeStatic/js/bootstrap-table/bootstrap-table.min.js"></script>
<script src="${request.contextPath}/static/ihomeStatic/js/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
<script src="${request.contextPath}/static/ihomeStatic/js/layer/layer.js"></script>
<script src="${request.contextPath}/static/js/common-ui.js?v=3.0.0"></script>

<script>

    $(function () {
        tableInit();
    });

    var prefix = "${request.contextPath}/subjectManage";

    var queryUrl = prefix + "/selectAll";
    function tableInit() {

        var course = $("#course option:selected").val();
        var chapterId = $("#chapter option:selected").val();
        var questionType = $("#questionsType option:selected").val();
        var status = $("#status option:selected").val();
        $('#datatable').bootstrapTable({
            url: queryUrl,                      //请求后台的URL（*）
            method: 'POST',                      //请求方式（*）
            contentType:"application/x-www-form-urlencoded",
            // classes: 'table table-hover',  //table加样式
            // theadClasses: "tableHead",                // 表头加样式
            //height: 400,
            // toolbar: '#toolbar',              //工具按钮用哪个容器
            striped: true,                     //是否显示行间隔色
            //cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            queryParams : function(params){
                return{
                    offset  : params.offset,
                    limit   : params.limit,
                    'courseId'  : course,
                    'chapterId'  : chapterId,
                    'questionType'  : questionType,
                    'status':status
                }

            },
            paginationLoop:false,                 //是否循环，从最后一页跳转到第一页（*）
            //sortable: true,                     //是否启用排序
            //sortOrder: "asc",                   //排序方式
            sidePagination: "client",             //分页方式：client客户端分页，server服务端分页（*）
            striped : true,                       //设置隔行变色效果
            minimumCountColumns : 2,              //当列数小于此值时，将隐藏内容列下拉框。
            paginationPreText : '上一页',
            paginationNextText : '下一页',
            pageNumber: 1,                        //初始化加载第一页，默认第一页,并记录
            pageSize : 3,                         //每页的记录行数（*）
            pageList : [3,6,9],                   //可供选择的每页的行数（*）
            search: false,                        //是否显示表格搜索
            strictSearch: false,
            showColumns: false,                   //是否显示所有的列（选择显示的列）
            //showRefresh: true,                  //是否显示刷新按钮
            //minimumCountColumns: 2,             //最少允许的列数
            // clickToSelect: true,               //是否启用点击选中行
            // uniqueId: "id",                    //每一行的唯一标识，一般为主键列
            // showToggle: false,                 //是否显示详细视图和列表视图的切换按钮
            // cardView: false,                   //是否显示详细视图
            // detailView: false,                 //是否显示父子表
            columns: [
                {
                    checkbox: true
                },
                {
                    field: 'id',
                    title: '编号',
                    undefinedText: "",
                    align: 'center'
                    // visible: false
                },{
                    field: 'serialNumber',
                    title: '序号',
                    undefinedText: "",
                    align: 'center'
                    // visible: false
                }, {
                    field: 'questionImageUrl',
                    title: '图片',
                    undefinedText: "",
                    align: 'center',
                    formatter:image,
                },{
                    field: 'answer',
                    title: '答案',
                    undefinedText: "",
                    align: 'center'
                }, {
                    field: 'videoExplainer',
                    title: '讲解人'
                }, {
                    field: 'questionType',
                    title: '题目类型',
                    undefinedText: "",
                    formatter:bannerTypeFormatter,
                    align: 'center'
                }, {
                    field: 'chapterName',
                    title: '章节',
                    undefinedText: "",
                    align: 'center'
                },{
                    field: 'sort',
                    title: '排序',
                    undefinedText: "",
                    align: 'center'
                },{
                    field: 'status',
                    title: '状态',
                    undefinedText: "",
                    align: 'center',
                    formatter:status
                },{
                    field: 'remark',
                    title: '描述',
                    undefinedText: "",
                    align: 'center'
                },{
                    field: 'createdTime',
                    title: '创建时间',
                    undefinedText: "",
                    align: 'center'
                },{
                    title: '操作',
                    align: 'center',
                    formatter: function(value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs" href="#" onclick="updateForId(\'' + row.id + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        actions.push('<a class="btn btn-success btn-xs" href="#" onclick="view(\'' + row.id + '\')"><i class="fa fa-edit"></i>查看</a> ');
                        actions.push('<a class="btn btn-danger btn-xs" href="#" onclick="deleteForId(\'' + row.id + '\')""><i class="fa fa-remove"></i>删除</a> ');
                        return actions.join('');
                    }

                }]
        });
        function bannerTypeFormatter(cellvalue,options,rowObject) {
            if (cellvalue == 1){
                return "基础选择题";
            } else if (cellvalue ==2){
                return "扩展选择题";
            } else if (cellvalue ==3){
                return "基础必会题";
            }else if (cellvalue ==4){
                return "扩展进阶题";
            }
            return '';
        }
        function image(cellvalue,options,rowObject) {
            return '<img  src='+cellvalue+' width="100" height="100" class="img-rounded" >';
        }
        function status(cellvalue,options,rowObject) {
            if (cellvalue == "Y"){
                return "有效";
            } else if (cellvalue =="N"){
                return "无效";
            }
        }
    }
    function changeChapter(){
        var id=$("#course option:selected").val();

        $.ajax({
            url:"${request.contextPath}/subjectManage/changeChapter",
            type:"POST",
            data:{id:id},
            success:function (data) {
                if(data.code!=null || data.code!=""){
                    $("#chapter option").remove();
                    for (var i =0;i<data.data.length;i++){
                        var id = data.data[i].id;
                        var chapterName = data.data[i].chapterName;
                        $("#chapter").append("<option value='"+id+"'>"+chapterName+"</option>");//新增option
                    }
                }
            },
            error:function () {
                alert("erer")
            }



        });
    }
    $("#search-btn").click(function () {
        $('#datatable').bootstrapTable('destroy');
        tableInit();
    });
    function deletes() {
        var arr=[];
        var ids = $('#datatable').bootstrapTable('getAllSelections');

        for (var i = 0; i < ids.length; i++) {
            arr.push(ids[i].id)
        }


        layer.confirm('是否确定删除？', {
            btn: ['是','否'] //按钮
        }, function(){
            $.ajax({
                url:"${request.contextPath}/subjectManage/deletes",
                type:"POST",
                data:{arr:arr.toString()},
                success:function (data) {
                    if(data.code!=null || data.code!="")
                        window.location.reload();
                },
                error:function () {
                    alert("erer")
                }
            });
            layer.msg('删除成功', {icon: 1});
        }, function(){
        });

    }

    function deleteForId(id) {

        layer.confirm('是否确定删除？', {
            btn: ['是','否'] //按钮
        }, function(){
            $.ajax({
                url:"${request.contextPath}/subjectManage/delete",
                type:"POST",
                data:{id:id},
                success:function (data) {
                    if(data.code!=null || data.code!="")
                        window.location.reload();
                },
                error:function () {
                    alert("erer")
                }
            });
            layer.msg('删除成功', {icon: 1});
        }, function(){
        });

    }

    function insert() {
        layer.open({
            type: 2,
            area: ['700px', '500px'],
            fixed: false, //不固定
            maxmin: true,
            content: '${request.contextPath}/subjectManage/toAdd',

            end: function () {

                if($("#hi1").val() == "1"){
                    layer.msg('成功', {icon: 1});
                    window.location.reload();
                }else {

                }

            }
        });
    }function updateForId(id) {
        layer.open({
            type: 2,
            area: ['700px', '500px'],
            fixed: false, //不固定
            maxmin: true,
            content: '${request.contextPath}/subjectManage/toUpdate?id='+id,

            end: function () {

                if($("#hi2").val() == "1"){
                    layer.msg('成功', {icon: 1});
                    window.location.reload();
                }else {

                }

            }
        });
    }

    function view(id) {
        layer.open({
            type: 2,
            area: ['700px', '500px'],
            fixed: false, //不固定
            maxmin: true,
            content: '${request.contextPath}/subjectManage/view?id='+id,
        });
    }



</script>
</html>
